<template>
  <div class="charts" ref="charts">
  </div>
</template>

<script>
import * as echarts from 'echarts'
export default {
    name:'',
    mounted(){
      let lineCharts =  echarts.init(this.$refs.charts)
      lineCharts.setOption({
            xAxis:{
                show:false,
                type:'category'
            },
            yAxis:{
                show:false

            },
            series:[{
                type:'line',
                data:[60,20,70,27,50,37,60,30],
                itemStyle:{
                    opacity:0
                },
                lineStyle:{
                    color:'pink'
                },
                areaStyle:{
                    color:{
                        type:"linear",
                        x:0,
                        y:0,
                        x2:0,
                        y2:1,
                        colorStops:[{
                            offset:0,
                            color:"pink"
                        },
                        {
                            offset:1,
                            color:"#fff"
                        }
                        ]
                    }
                },
                smooth:true
            }],
            grid:{
                left:0,
                top:0,
                right:0,
                bottom:0
                }
      })
    }
}
</script>

<style>
.charts{
    width: 100%;
    height: 100%;
}
</style>